import { createRouter, createWebHistory,createWebHashHistory,RouteRecordRaw } from 'vue-router'
// vue3的路由 变成hookapi写法 
// createRouter   创建路由的方法 替代以前的 new VueRouter
// createWebHistory  历史模式的路由  
// createWebHashHistory 创建hash模式的路由
// RouteRecordRaw  接口


import Home from '../views/Home.vue'
const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path:"/ak",
    name:"ak",
    component:()=>import("../views/Ak.vue"),
    meta:{ //自定义路由信息

    },
    // children 子路由
    // redirect:"/home",
    // alias:"别名",
    // beforeEnter(){}
  },
  {
    path:"/cart",
    name:"cart",
    component:()=>import("../views/Cart.vue")
  },
  {
    path:"/hello",
    name:"hello",
    component:()=>import("../views/Hello.vue")
  },
  {
    path:"/todo",
    name:"todo",
    component:()=>import("../views/todoList.vue")
  },
  {
    path:"/good",
    name:"good",
    component:()=>import("../views/Good.vue")
  },
  {
    path:"/mouse",
    name:"mouse",
    component:()=>import("../views/Mouse.vue")
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL), //历史模式的路由
  routes
})
// 路由守卫
// router.beforeEach((to,from,next)=>{
//     // to 即将进入的组件路由信息
//     // from 即将离开的组件路由信息
//     // 
//     console.log(to)
//     console.log(from)
//     if(to.name=="hello"){
//       if(!localStorage.token){
//         next("/cart");
//       }
//     }
//     next();
// })
// 全局后置
// router.afterEach(()=>{})
// 导出路由
export default router
